<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>欢迎登录华为站点</title>
    <script src="../h5/js/jquery.js"></script>
    <style>
        .logo {
    position: absolute;
    top: 20px;
	left: 24px;
	height: 24px;
             }
        .logo img {
	height: 100%;
             }
        .menu_open_icon {
	position: relative;
	height: 10px;
            }
            .menu_open_icon::after {
	content: '';
	width: 16px;
    height: 2px;
    background: #000;
    display: block;
}
.menu_open_icon::before {
	content: '';
	position: absolute;
	bottom: 0;
	width: 16px;
    height: 2px;
    background: #000;
    display: block;
}
.lang-select-wrap {
  position: absolute;
  top: 26px;
  right: 24px;
}
.main_div{
     padding: 0px 24px 2em;
    }
    .mobile_login_link{
        font-size: 14px;
	    margin: 12px 13px 20px;
	    font-family: PingFangSC-Regular;
	    color: #007DFF;
	    letter-spacing: 0;
	    text-align: right;
	    cursor: pointer;
	    position: relative;
    }
    body,div,p {
	padding: 0;
}
.account_login {
	font-weight: bold;
    font-size: 24px;
    text-align: center;
}
.account_login_link {
	font-size: 14px;
    margin: 10px 0 40px;
    font-family: PingFangSC-Regular;
    color: #007DFF;
    letter-spacing: 0;
    text-align: center;
    cursor: pointer;
    position: relative;
}
.bound {
	margin: 0 auto;
	color: #333;
}
input[type=text],input[type='password'] {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #999;
}
.input_box {
	box-sizing: border-box;
	line-height:40px;
	text-decoration: none;
	width: 100%;
	border: 0;
	padding-left: 8px;
	border-bottom: 1px solid #bababa;
}
.pwd-input {
 position: relative;
}
.pwd-input img {
	position: absolute;
	right:14px;
	bottom: 14px;
	width:20px;
	height:18px;
}
.bound2{
padding-top:10px;
padding-bottom:0px;
border:solid #AEAEAE 0px;
border-left:0;
color: #333;
width:100%;
float:left;
text-align:right;
height:2.5em;
line-height: 2.5em
}
.login-type {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  color: #007DFF;
}
.bound {
	margin: 0 auto;
	color: #333;
}
.button {
	flex: 0 0 46%;
  height: 40px;
  line-height: 40px;
  background-color: #F66F6A;
  border: 0;
  border-radius: 20px;
  font-size: 16px;
  text-align: center;
  outline: none;
  color: #fff;
}
.button_default {
	display: block;
	background: #f3f3f3;
	color: #F66F6A;
}
.button {
	width: 100%;
	margin: 8px 0;
	text-decoration: none;
	cursor: pointer;
}
.pwd-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 32px 0 48px;
  font-size: 16px;
  color: #007DFF;
}
.divider {
  height: 12px;
  margin: 0 1em;
  border: 1px solid #aaa;
}
.menu_wrap {
	position: fixed;
	width: 100vw;
	box-sizing: border-box;
	padding: 20px 24px;
	background: #fff;
	height: 100%;
	top: 0;
	overflow: hidden;
	transform: translateX(100%);
	transition: transform .3s;
	z-index: 100;
	font-size: 16px;
	text-align: left;
}
.menu_header {
	font-weight: bold;
	margin-bottom: 10px;
}
.close_icon {
	float: right;
	margin-top: -4px;
	width: 18px;
	height:18px;
}
.menu_item {
    border-bottom: 1px solid #e0e0e0;
    padding: 20px 0;
    color: #666;
}
.menu_item {
	border-bottom: 1px solid #e0e0e0;
	padding: 20px 0;
	color: #666;
}
.pull_down_icon {
	float: right;
	transform: rotate(-90deg);
	margin: 6px;
	transition: transform .3s;
}
#menu_wrap{
    display: none;
}
    </style>
</head>
<body>
    <div class="logo">
        <img src="../logo_wap.png" alt="Huawei" importance="high" decoding="sync">
    </div>
    <div style="margin-top: 56px; border-bottom: 1px solid #d8d8d8;"></div>

    <div class="menu_wrap" id="menu_wrap" style="transform: translateX(0%);">
        <div class="menu_header">
            <img class="close_icon" src="../close.png" id="menu_close">
        </div>
        <div class="menu_item" id="language_select">
            <span id="now_language"> 简体中文（中国）</span>
            <span class="pull_down_icon" id="pull_down_icon">


            </span>
        </div>
        <div class="menu_item">
            <span id="help_l" style="direction: ltr;">
                <a href="#" style="text-decoration:none !important;color:#007DFF">帮助</a>
            </span>
        </div>
        <div class="menu_item">
            <a href="#" style="text-decoration:none !important;color:#007DFF">隐私声明</a>
        </div>
    </div>

    <script>
      $(function(){
        $('#menu_open_icon').click(function(){
            $('#menu_wrap').slideToggle();
        })
        $('#menu_close').click(function(){
            $('#menu_wrap').hide();
        })
      })
    </script>
    
    <div class="lang-select-wrap">
    <div class="menu_open_icon" id="menu_open_icon">
    </div>
    </div>
    <div class="main_div">
        <div class="mobile_login_link">

        </div>
        <div>
            <div class="account_login">
                
		 
		     
			
			   Uniportal帐号登录
			 
	      
		
            </div>
            <div class="account_login_link">

            </div>
            <div class="bound">
                <input tabindex="1" type="text" class="input_box" name="uid" style="margin-top: 0;" placeholder="Uniportal帐号/邮箱" onkeyup="checkIsNull(this.value,'verifyAccount');"value>
            </div>
            <div class="bound pwd-input">
                <input tabindex="2"  type="password" class="input_box" name="password" id="pwd" autocomplete="off" style="padding-right: 48px;" placeholder="密码" onkeyup="checkIsNull(this.value,'verifyPassword');" styleid="password" value>
                <img src="../password_hide.png" style="display: block;" id="eye">
            </div>
            <div class="bound2" style="margin-bottom: 20px;">
                <span class="login-type">
                    <a href="https://uniportal.huawei.com/uniportal/forwardLogin.do?getloginMethod=byPhone&wap=1&redirect=https%3A%2F%2Fwww.huawei.com%2Fcn%2F" style="text-decoration:none !important;color:#007DFF">手机号码登录</a>
                    <a href="https://uniportal.huawei.com/uniportal/forwardLogin.do?getloginMethod=bySmscode&wap=1&redirect=https%3A%2F%2Fwww.huawei.com%2Fcn%2F" style="text-decoration:none !important;color:#007DFF">短信登录</a>
                </span>
            </div>
            <div class="bound">
                <input tabindex="4" id="login" class="button" type="button" onclick="userLogin();" value="登录">
            </div>
            <a onclick="forwardtoregister();" name="register" target="_self" class="button button_default" style="background-color:#f3f3f3;color:#F66F6A" href="">注册</a>
            <div class="pwd-wrap">
                <a href="https://uniportal.huawei.com/uniportal/modifyInfo.do?actionFlag=toGetPassword&redirect=%2Funiportal%3Fredirect%3Dhttps%25253A%25252F%25252Fwww.huawei.com%25252Fcn%25252F&wap=1" style="text-decoration:none !important;color:#007DFF">
                <span>
                    忘记密码
                </span>
                </a>
                <i class="divider"></i>
                <a href="https://uniportal.huawei.com/uniportal/modifyInfo.do?actionFlag=toModifyPassword&modifypwdby=byuserid&redirect=%2Funiportal%3Fredirect%3Dhttps%25253A%25252F%25252Fwww.huawei.com%25252Fcn%25252F&wap=1" style="text-decoration:none !important;color:#007DFF">
                <span>
                    修改密码
                </span>
                </a>
            </div>
        </div>
        </div>
    </div>
    <script>
        var eye = document.querySelector('#eye');
        var pwd = document.querySelector('#pwd');
        var flag = 0;
        eye.onclick = function () {
            if (flag === 0) {
                eye.src = '../password_show.png';
                pwd.type = 'text';
                flag = 1;
            } else {
                eye.src = '../password_hide.png';
                pwd.type = 'password';
                flag = 0;
            }
        };
    </script>
</body>
</html>